import type { FieldConfig } from '@/components/TableFilter.vue'
import { getFormFields } from '@/utils/formUtils'
import type { FormFieldConfig } from '@/types/form'

// 表格列配置
export const tableColumns = [
  {
    title: 'ID',
    dataIndex: 'id',
  },
  {
    title: '角色名稱',
    dataIndex: 'name',
  },
  {
    title: '最後修改人',
    dataIndex: 'updatedBy',
  },
  {
    title: '最後修改時間',
    dataIndex: 'updatedAt',
  },
  {
    title: '操作',
    key: 'action',
    align: 'center',
  },
]
// 過濾項配置
export const filterFields: FieldConfig[] = [
  {
    name: 'name',
    label: '角色名稱',
    type: 'input',
    placeholder: '請輸入角色名稱',
  },
]

// 表單字段配置
export const FormField: Record<string, FormFieldConfig> = {
  name: {
    label: '角色名稱',
    type: 'input', //作用是將一個值斷言為字面量類型
    placeholder: '請輸入角色名稱',
    rules: [
      { required: true, message: '請輸入角色名稱' },
      { type: 'string', min: 2, max: 10, message: '角色名稱長度為2-10個字符' },
    ],
  },
}

// 創建表單字段
export const getCreateFieldConfig = () => {
  const fields = ['name']
  return getFormFields(FormField, fields)
}

export const getEditFieldConfig = () => {
  const fields = ['name']
  return getFormFields(FormField, fields)
}
